<template>
    <div>
        <div>
            <input type="text" v-model="username" @change="checkUserName"/>
            <span>{{username_tips}}</span>
        </div>
        <div>
            <input type="text" v-model="password"/>
        </div>
        <button @click="submit">提交</button>
    </div>
</template>

<script>
export default {
    /* eslint-disable */
    name: "Reg",
    data() {
        return {
            username: '',
            username_tips:'',
            password: ''
        }
    },
    methods:{
        checkUserName(){
            this.username_tips = '验证中...'
            fetch("http://localhost:8080/user/query?name=" + this.username)
                .then(res=>res.text())
                .then(result=> {
                    if(result != 'success'){
                        this.username_tips = '账号有问题,请换一个'
                    }else{
                        this.username_tips = ''
                    }
                });
        },
        submit(){
            if(this.username.length == 0 || this.username_tips.length != 0){
                return;
            }
            alert('注册成功')
        }
    }
}
</script>

<style scoped>

</style>